<div id="contenedorListaPreguntas">
	<div id="textoListaPreguntas">
		<p style="font-size: 15px; text-align:left;" >Selecciona un tema y un nivel para ver todas preguntas de esta categoria. <br/>
		Para validar, seleccionar la casilla valida correspondiente a la pregunta que se desea validar y después guardar. <br/>
		Para modificar, seleccionar la linea de la tabla correspondiente a la pregunta que se desea modificar.
		</p>
	</div>
	<br/>
	<div id="seleccion" class="form-inline" >

		<fieldset>
			<div id="asignatura" class="form-group">
				<label  for="asignaturas" class="col-sm-3 control-label">Tema:</label> 
				<div class="col-sm-3">
					<select id="asignaturas" name="idAsignatura" class="form-control " required>
						<option value="">-- Tema --</option>
					</select>
				</div>
			</div>
			<div id="nivel" class="form-group">
				<label  for="dificultades" class="col-sm-3 control-label">Nivel:</label>
				<div class="col-sm-3">
					<select id="dificultades" name="idDificultad" class="form-control" required>
						<option value="">-- Nivel --</option>
					</select>
				</div>
			</div>
			<input type="button" class="btn btn-primary" value="Buscar Preguntas" id="buscarPreguntas"/>
		</fieldset>
	</div>
		
	<br/>
	<br/>
			
	<form>
		<table class="table table-bordered table-striped table-hover table-responsive"
			id="contenedorPreguntas">
			<thead>
				<th>Contenido de la respuesta</th>
				<th>Creada por</th>
				<th>Valida</th>
			</thead>
		</table>
		<input type="submit" id="guardar" value="Guardar" class="btn btn-primary">
	</form>
</div>
	
<script>
// El one sirve para llamarlo solo una vez
$(document).one("ajaxComplete", seleccion);

function seleccion() {

	// Cargar asignatura
	var $asignaturas = $('#asignaturas');
	var urlAsignatura = "../dispatcher/referencias/asignaturas";

	$.getJSON(urlAsignatura, function(datos) {
		$.each(datos, function(i, item) {
			$asignaturas.append('<option value="'+ item.id +'">'
					+ item.nombre + '</option>');
			$asignaturas.append(item.nombre);
		});

	});

	// Cargar dificultades
	var $dificultades = $('#dificultades');
	var urlDificultad = "../dispatcher/referencias/dificultad";

	$.getJSON(urlDificultad, function(data) {
		$.each(data, function(i, item) {
			$dificultades.append('<option value="'+ item.id +'">'
					+ item.label + '</option>')
			$dificultades.append(item.label);
		});

	});

};

$("#buscarPreguntas").click(function() {
	cargarPreguntas();
	
});

var idPregunta;

function cargarPreguntas() {
	$("#contenedorPreguntas > tbody > tr").remove();
	
	var asignatura = $('#asignaturas').val();
	var dificultad = $('#dificultades').val();
	var urlPreguntas = "../dispatcher/pregunta/recuperarPreguntas";
	urlPreguntas += "?asignaturaId="+ asignatura + "&dificultadId=" + dificultad;
	
	$.getJSON(urlPreguntas, function(data) {
		$.each(data, function(i, item) {
			var linea = "";
			
			linea += '<tr id='+ item.id +'>'
					+ '<td>' + item.enunciado + '</td>'
					+ '<td>' + item.creador + '</td>'
					+ '<td>' + ' <input  type="checkbox" name="valida" ';
					
			if (item.valida) {
				linea += ' checked="' + item.valida + '"';
			}		 
					
			linea += '"/> '
					+'</td>'
					+ '</tr>';  
			$(contenedorPreguntas).append(linea);		
			
		});
		$( "#contenedorPreguntas" ).selectable({
			filter:"tr"
		});
		
		$( "#contenedorPreguntas" ).on("selectableselecting", function( event, ui ) {
			idPregunta = ui.selecting.id;
			if (idPregunta !== "") {
				$('#contenedorListaPreguntas').load('administracion/modificarPregunta.html', { idPregunta: idPregunta});
			}
		});
	});
}

$('form').submit(function(event) {
	 
	event.preventDefault();
	
	
	var dataForm = [];
	
	$('form').find('tr').each(function() {
		var id = $(this).attr('id');
		var row = {};
		$(this).find('input').each(function() {
			row["valida"] = this.checked;
	    	row["id"] = id;
			dataForm.push(row);
		});
		
		
	}); 
	
	$.ajax({
		type : "POST",
		url : "../dispatcher/pregunta/validacionPreguntas",
		data : JSON.stringify(dataForm),
		beforeSend : function(xhr) {
			xhr.setRequestHeader("Accept", "application/json");
			xhr.setRequestHeader("Content-Type", "application/json");
		},
		success: function (datos) {
                  cargarPreguntas();
          },
          error : function (data, status, er) {
          	alert("error" + data + " status " +status+" er:"+er );
          }
	});

});

</script>